<template>
	<view class="entry-exam">
		<view class="block">
			<view class="b-title">考试简介</view>
			<view class="item">
				<text class="i-title">考试科目</text>
				<text class="i-content ellipsis-1">{{dataObj.examName}}</text>
			</view>
			<view class="item">
				<text class="i-title">考试规格</text>
				<text class="i-content">{{dataObj.examSpec}}</text>
			</view>
			<view class="item">
				<text class="i-title">剩余次数</text>
				<text class="i-content">{{dataObj.remainFrequency}}次</text>
			</view>
			<view class="item">
				<text class="i-title">平均成绩</text>
				<text class="i-content">{{dataObj.mattersNeedAttention ? dataObj.mattersNeedAttention + '分' : '-'}}</text>
			</view>
			<view class="btn" @click="onExamTap(item)">进入考试</view>
		</view>
		<view class="block">
			<view class="b-title m-b-34">最近考试记录</view>
			<view class="list">
				<view class="tr">
					<view class="th">序号</view>
					<view class="th">耗时</view>
					<view class="th">正确率</view>
					<view class="th">成绩</view>
					<view class="th">操作</view>
				</view>
				<view v-if="dataObj.list.length">
					<view class="tr" v-for="item in dataObj.list" :key="item.examId">
						<view class="td">{{item.sort}}</view>
						<view class="td">{{item.sumExamMinute}}</view>
						<view class="td">{{item.correctRate || '-'}}</view>
						<view class="td">{{item.totalScore || 0}}</view>
						<view class="td view" @click="onOptsTap(item)">{{item.state === 1 ? '继续' : '查阅'}}</view>
					</view>
				</view>
				<view v-else>
					<view class="tr">
						<view class="td">暂无数据</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import avatarDefault from '@/static/images/user/avatar-default.png';
	import { requestErrorTip, loginExam } from '@/common/tools.js';
	
	export default {
		data() {
			return {
				dataObj: {
					id: '',
					examName: '',
					examSpec: '',
					remainFrequency: '',
					mattersNeedAttention: '',
					examId: '',
					list: []
				}
			}
		},
		onLoad(event) {
			const title = event['title']; // 获取试题名称
			this.dataObj['title'] = title;
			this.dataObj['id'] = event['id']; // 获取试题id
			uni.setNavigationBarTitle({
			　　title: title
			});
		},
		onShow() {
			this.getExamInfo(); // 获取数据
		},
		// 下拉刷新
		onPullDownRefresh() {
			this.getExamInfo();
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		methods: {
			// 操作
			onOptsTap(item) {
				if (item.state === 1) {
					// 继续考试
					uni.navigateTo({
						url: './exam?examId=' + this.dataObj['examId'] + '&subjectId=' + this.dataObj['id'] + '&title=' + this.dataObj['title']
					});
				} else {
					// 查看结果
					uni.navigateTo({
						url: './result?examId=' + item['examId'] + '&title=' + this.dataObj['title']
					});
				}
			},
			// 考试
			onExamTap(item) {
				this.postCreatExam(() => {
					uni.navigateTo({
						url: './exam?examId=' + this.dataObj['examId'] + '&subjectId=' + this.dataObj['id'] + '&title=' + this.dataObj['title']
					});
				});
			},
			// 创建考试
			postCreatExam(cb) {
				this.$Requset({
					url: this.$Api['exam']['createExamPaper'],
					data: {
						token_exam: uni.getStorageSync('examToken'),
						studentId: uni.getStorageSync('studentId'),
						subjectId: this.dataObj['id']
					},
					method: 'POST',
					success: (res) => {
						const { data, status, message } = res;
						if (status !== 300) {
							if (status === 103) {
								const userInfo = uni.getStorageSync('userInfo');
								const mobile = userInfo['mobile'];
								loginExam(mobile, () => {
									this.postCreatExam(cb);
								});
								return;
							}
							requestErrorTip('toast', message);
							return;
						}
						this.dataObj['examId'] = data['examId'];
						cb && cb();
					},
					fail: (err) => {
						console.log(err);
					}
				})
			},
			// 获取考试信息
			getExamInfo() {
				this.$Requset({
					url: this.$Api['exam']['getExamInfo'],
					data: {
						token_exam: uni.getStorageSync('examToken'),
						studentId: uni.getStorageSync('studentId'),
						subjectId: this.dataObj['id'],
					},
					method: 'POST',
					success: (res) => {
						const { data, status, message } = res;
						if (status !== 300) {
							if (status === 103) {
								const userInfo = uni.getStorageSync('userInfo');
								const mobile = userInfo['mobile'];
								loginExam(mobile, () => {
									this.getExamInfo();
								});
								return;
							}
							requestErrorTip('toast', message);
							return;
						}
						this.dataObj['examName'] = data['examName'];
						this.dataObj['examSpec'] = data['examSpec'];
						this.dataObj['remainFrequency'] = data['remainFrequency'];
						this.dataObj['mattersNeedAttention'] = data['mattersNeedAttention'];
						this.getExamList();
					},
					fail: (err) => {
						console.log(err);
					}
				})
			},
			// 获取考试记录
			getExamList() {
				this.$Requset({
					url: this.$Api['exam']['getExamList'],
					data: {
						token_exam: uni.getStorageSync('examToken'),
						studentId: uni.getStorageSync('studentId'),
						subjectId: this.dataObj['id']
					},
					method: 'POST',
					success: (res) => {
						const { data, status, message } = res;
						if (status !== 300) {
							this.dataObj['list'] = [];
							if (status === 103) {
								const userInfo = uni.getStorageSync('userInfo');
								const mobile = userInfo['mobile'];
								loginExam(mobile, () => {
									this.getExamList(cb);
								});
								return;
							}
							requestErrorTip('toast', message);
							return;
						}
						this.dataObj['list'] = data;
						data.forEach((item) => {
							if(item['state'] === 1) {
								this.dataObj['examId'] = item['examId'];
							}
						})
					},
					fail: (err) => {
						console.log(err);
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #f5f5f5;
	}
	.entry-exam{
		padding-top: 18rpx;
		.b-title{
			line-height: 40rpx;
			font-size: 30rpx;
			color: #373737;
			margin-bottom: 30rpx;
		}
		.item{
			display: flex;
			align-items: center;
			justify-content: space-between;
			line-height: 44rpx;
			font-size: 26rpx;
			margin-top: 18rpx;
			.i-title{
				color: #7F7F7F;
			}
			.i-content{
				color: #1A1A1A;
			}
		}
		.btn{
			line-height: 90rpx;
			font-size: 30rpx;
			color: #FFFFFF;
			text-align: center;
			background-color: $color-common;
			border-radius: 45rpx;
			margin-top: 44rpx;
		}
		.m-b-34{
			margin-bottom: 34rpx;
		}
		.list{
			background-color: #F7F7F7;
			border-radius: 11rpx;
			.tr{
				display: flex;
				height: 62rpx;
				line-height: 62rpx;
				font-size: 22rpx;
				text-align: center;
				border-bottom: 1rpx solid #EAEFF1;
				&:nth-last-child(1){
					border-bottom: 0;
				}
				.th{
					flex: 1;
					color: #7F7F7F;
					border-right: 1rpx solid #EAEFF1;
					&:nth-last-child(1){
						border-right: 0;
					}
				}
				.td{
					flex: 1;
					color: #1A1A1A;
					border-right: 1rpx solid #EAEFF1;
					&:nth-last-child(1){
						border-right: 0;
					}
				}
				.view{
					color: $color-common;
				}
			}
		}
	}
</style>
